<template>
  <div>
    <a-modal v-model="visible" centered title="退订" width="600px" @cancel="close" @ok="submit" :destroyOnClose="true">
      <h2>确定要退订吗？</h2>
      <p>请在已退款成功后再进行退订标记。退订后，该订阅服务将关闭</p>
      <a-form :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
        <template v-if="record.subType == 1">
          <a-form-item label="退还积分" required> <a-input-number v-model="point" :min="0" style="width:150px;margin-right:8px;" /> 分 </a-form-item>
        </template>
        <template v-if="record.subType == 0">
          <a-form-item label="退款金额" required> <a-input-number v-model="price" :min="0" style="width:150px;margin-right:8px;" /> 元 </a-form-item>
        </template>
        <a-form-item label="备注" required>
          <a-textarea v-model="memo" :rows="6" :maxLength="20" placeholder="请输入备注，不超过200个字" />
          <p style="color:#f5222d;" v-if="tips">请填写备注！</p>
        </a-form-item>
      </a-form>
    </a-modal>
  </div>
</template>
<script>
import { unSubscribe, beforeViewUnSubscribe } from '@/api/box/marketing'
export default {
  data() {
    return {
      visible: false,
      record: {},
      memo: '',
      point: '',
      price: '',
      tips: false
    }
  },
  methods: {
    close() {
      this.visible = false
      this.memo = ''
      this.point = 0
      this.price = 0
      this.$emit('refreshTable')
    },
    show(record) {
      this.record = record
      if (record.subType == 1 || record.subType == 0) {
        this.getBeforeView(record)
      }
      this.visible = true
    },
    getBeforeView(record) {
      let params = {
        requestData: {
          subId: record.id
        }
      }
      beforeViewUnSubscribe(params).then(res => {
        if (res.code == 0) {
          if (record.subType == 1) this.point = res.data.subscribeOrder.payPoint
          if (record.subType == 0) this.price = res.data.subscribeOrder.payPrice
        } else {
          this.$message.warning(res.msg)
        }
      })
    },
    submit() {
      if (this.memo) {
        this.tips = false
        let params = {
          requestData: {
            memo: this.memo,
            subId: this.record.id
          }
        }
        if (this.record.subType == 1) {
          params.requestData.point = this.point
        }
        if (this.record.subType == 0) {
          params.requestData.price = this.price
        }
        unSubscribe(params).then(res => {
          if (res.code == 0) {
            this.$message.success('退订成功！')
            this.$emit('refreshTable')
            this.close()
          } else {
            this.$message.warning(res.msg)
          }
        })
      } else {
        this.tips = true
      }
    }
  }
}
</script>

